<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
</head>
<style>
    .wrap {
        position: fixed;
        left: 50%;
        top: 50%;
    }

    input {
        width: 200px;
        height: 30px;
        font-size: 15px;
    }

    button {
        margin-top: 10px;
    }
</style>
<body>
<div id="app">
    <div class="wrap">
        <div>
            <h3>sn：</h3>
            <input type="text" v-model="sn">
        </div>
        <div>
            <h3>秘钥：</h3>
            <input type="text" v-model="device_secret">
        </div>
        <button @click="submit">查询</button>
    </div>
</div>
</body>
</html>
<script>
    new Vue({
        el: '#app',
        data() {
            return {
                sn: '',
                device_secret: ''
            }
        },
        methods: {
            submit() {
                const params = {
                    device_secret: this.device_secret,
                    sn: this.sn
                }
                console.log(params)
                fetch('https://v.hilx.cn/likeadmin/device/bind', {
                    method: 'post',
                    headers: {
                        'Accept': 'application/json, text/plain, */*',
                        'Content-Type': 'application/json;charset=UTF-8',
                    },
                    body: JSON.stringify(params)
                }).then(res => res.text()).then(res => {
                    const data = JSON.parse(res)
                    console.log(data)
                }).catch(err => {
                    console.log(err)
                })
            }
        }
    })
</script>
